<template>
  <div class="list-page-container custom-ant">
    <a-card>
      <a-form layout="inline" @keyup.enter.native="handleSearch">
        <a-row :gutter="24">
          <a-col :md="6" :sm="24">
            <CompositeSearch
              :fieldList="fieldList"
              @getParams="getSearchValue"
              @adSearch="onAdSearch"
              @adClear="onAdClear"
              @tagClick="onTagClick">
              <template v-slot:ad-search-content>
                <a-form-model
                  ref="adSearchFormRef"
                  :model="adSearchFormData"
                  layout="vertical">
                  <a-row :gutter="24">
                    <a-col :span="24">
                      <a-form-model-item label="供应商状态">
                        <ASelectList v-model="adSearchFormData.supplierStatus" :isHasDict="false" :defaultOption="supplierStatusOption"/>
                      </a-form-model-item>
                    </a-col>
                  </a-row>
                  <a-row :gutter="24">
                    <a-col :span="24">
                      <a-form-model-item label="冻结申请审批状态">
                        <ASelectList v-model="adSearchFormData.frozenStatus" :isHasDict="false" :defaultOption="approveStatusOption"/>
                      </a-form-model-item>
                    </a-col>
                  </a-row>
                  <a-row :gutter="24">
                    <a-col :span="24">
                      <a-form-model-item label="恢复申请审批状态">
                        <ASelectList v-model="adSearchFormData.recoverStatus" :isHasDict="false" :defaultOption="approveStatusOption"/>
                      </a-form-model-item>
                    </a-col>
                  </a-row>
                  <a-row :gutter="24">
                    <a-col :span="24">
                      <a-form-model-item label="淘汰申请审批状态">
                        <ASelectList v-model="adSearchFormData.outStatus" :isHasDict="false" :defaultOption="approveStatusOption"/>
                      </a-form-model-item>
                    </a-col>
                  </a-row>
                  <a-row :gutter="24">
                    <a-col :span="24">
                      <a-form-model-item label="黑名单申请审批状态">
                        <ASelectList v-model="adSearchFormData.blackListStatus" :isHasDict="false" :defaultOption="approveStatusOption"/>
                      </a-form-model-item>
                    </a-col>
                  </a-row>
                  <a-row :gutter="24">
                    <a-col :span="24">
                      <a-form-model-item label="创建时间">
                        <a-range-picker
                          v-model="createTime"
                          format="YYYY-MM-DD"
                          style="width:100%;"
                          @change="(timeRange, timeStringRange) => setTimeRange('createTimeStart', 'createTimeEnd', timeRange, timeStringRange)"/>
                      </a-form-model-item>
                    </a-col>
                  </a-row>
                </a-form-model>
              </template>
            </CompositeSearch>
          </a-col>
          <a-col :md="18" :sm="24">
            <div class="space-btn">
              <a-button @click="onExport">导出</a-button>
              <a-button type="danger" @click="onBatchDelete">删除</a-button>
            </div>
          </a-col>
        </a-row>
      </a-form>
      <a-tabs type="card" v-model="curTabValue" @change="tabChange">
        <a-tab-pane v-for="item in tabList" :key="item.key" :tab="item.tab" :disabled="loading"></a-tab-pane>
      </a-tabs>
      <a-table
        ref="table"
        rowKey="id"
        size="middle"
        bordered
        :loading="loading"
        :columns="columns"
        :dataSource="dataSource"
        :row-selection="{ fixed: true, selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
        :scroll="{ x: '100%', autoHeight: true }"
        :pagination="pagination">
        <span slot="date" slot-scope="text">{{ text | DateFormat }}</span>
        <template slot="supplierStatus" slot-scope="text">
          <span v-if="text === '1'">合格</span>
          <template v-if="text === '2'">
            <span class="cus-text" warn>不合格</span>
            <a-popover title="提示说明">
              <template slot="content">
                <span>绩效考核总分不合格</span>
              </template>
              <a-icon type="info-circle" class="circle-hover" />
            </a-popover>
          </template>
        </template>
        <template slot="approveStatus" slot-scope="text"><span>{{ approveStatusEnum[text] || '/' }}</span></template>
        <template slot="supplierLevel" slot-scope="text">
          <span v-if="text === 'A'">A</span>
          <span v-if="text === 'B'">B</span>
          <span v-if="text === 'C'" class="cus-text" warn>C</span>
          <span v-if="text === 'D'" class="cus-text" danger>D</span>
        </template>
        <template slot="action" slot-scope="text, record">
          <span
            v-if="curTabValue === '1' && record.frozenStatus === '1'"
            class="cus-text"
            danger pointer
            @click="onApply('申请冻结', record)">
            申请冻结
          </span>
          <span
            v-if="curTabValue === '2' && record.recoverStatus === '1'"
            class="cus-text"
            danger pointer
            @click="onApply('申请恢复', record)">
            申请恢复
          </span>
          <span
            v-if="curTabValue === '2' && record.outStatus === '1'"
            class="cus-text"
            danger pointer
            @click="onApply('申请淘汰', record)">
            申请淘汰
          </span>
          <span
            v-if="curTabValue === '3' && record.blackListStatus === '1'"
            class="cus-text"
            danger pointer
            @click="onApply('申请黑名单', record)">
            申请黑名单
          </span>
          <span class="cus-text" pointer @click="onCheck(record)">查看</span>
        </template>
      </a-table>
    </a-card>

    <!-- 智能估计看板 -->
    <IntelligentEstimationBoard ref="IntelligentEstimationBoard" />
    <!-- 供应商生效详情 -->
    <EffectDetail ref="EffectDetail" />
  </div>
</template>

<script>
import ListPageMixin from '@/mixins/ListPageMixin.js';
import optionsMixin from '@views/supplier-manage/effect/optionsMixin.js'
import IntelligentEstimationBoard from '@views/supplier-manage/register/components/IntelligentEstimationBoard.vue'
import EffectDetail from '@views/supplier-manage/effect/detail.vue'

export default {
  name: 'RegisterIndex',
  mixins: [ ListPageMixin, optionsMixin ],
  components: {
    IntelligentEstimationBoard,
    EffectDetail
  },
  data() {
    return {
      adSearchFormData: {
        supplierStatus: '',
        frozenStatus: '',
        recoverStatus: '',
        outStatus: '',
        blackListStatus: '',
        createTimeStart: '',
        createTimeEnd: '',
      },
      createTime: [],
      curTabValue: '1',
      tabList: [
        { tab: '生效供应商', key: '1'  },
        { tab: '冻结供应商', key: '2' },
        { tab: '淘汰供应商', key: '3' },
        { tab: '黑名单', key: '4' },
      ],
      dataSource: [],
      originalDataSource: [
        // 生效供应商
        {
          curTabValue: '1',
          createTime: '2025-1-10 12:00:00',
          supplierStatus: '1',
          frozenStatus: '',
          recoverStatus: '',
          outStatus: '',
          blackListStatus: '',
          supplierLevel: 'A',
          supplierFullName: '河南盛世机械工具集团有限公司',
          supplierShortName: '河南盛世机械',
          supplierMainCategory: '传感器',
          supplierCode: 'GYS6667787990',
          contactArea: '广东省-广州市-黄埔区',
          contactAddress: '文冲街上塘北路35号',
          depositBank: '中国工商银行',
          receivablesAccount: '6212263602053303588',
          receivablesPerson: '李小姐',
          legalRepresentative: '杨先生',
          uscCode: '914401017435912',
          enterpriseQueryResult: '2023-06-08【有效请求】查询成功',
          inquiryChannel: '天眼查',
        },
        {
          curTabValue: '1',
          createTime: '2025-1-10 12:00:00',
          supplierStatus: '2',
          frozenStatus: '1',
          recoverStatus: '',
          outStatus: '',
          blackListStatus: '',
          supplierLevel: 'C',
          supplierFullName: '广州三五零配件有限公司',
          supplierShortName: '广州三五零配件',
          supplierMainCategory: '传感器',
          supplierCode: 'GYS6667787990',
          contactArea: '广东省-广州市-黄埔区',
          contactAddress: '文冲街上塘北路35号',
          depositBank: '中国工商银行',
          receivablesAccount: '6212263602053303588',
          receivablesPerson: '李小姐',
          legalRepresentative: '杨先生',
          uscCode: '914401017435912',
          enterpriseQueryResult: '2023-06-08【有效请求】查询成功',
          inquiryChannel: '天眼查',
        },
        {
          curTabValue: '1',
          createTime: '2025-1-10 12:00:00',
          supplierStatus: '2',
          frozenStatus: '2',
          recoverStatus: '',
          outStatus: '',
          blackListStatus: '',
          supplierLevel: 'D',
          supplierFullName: '广汽集团广天有限公司',
          supplierShortName: '广汽集团广天',
          supplierMainCategory: '传感器',
          supplierCode: 'GYS6667787990',
          contactArea: '广东省-广州市-黄埔区',
          contactAddress: '文冲街上塘北路35号',
          depositBank: '中国工商银行',
          receivablesAccount: '6212263602053303588',
          receivablesPerson: '李小姐',
          legalRepresentative: '杨先生',
          uscCode: '914401017435912',
          enterpriseQueryResult: '2023-06-08【有效请求】查询成功',
          inquiryChannel: '天眼查',
        },
        // 冻结供应商
        {
          curTabValue: '2',
          createTime: '2025-1-10 12:00:00',
          supplierStatus: '2',
          frozenStatus: '',
          recoverStatus: '1',
          outStatus: '1',
          blackListStatus: '',
          supplierLevel: 'C',
          supplierFullName: '河南盛世机械工具集团有限公司',
          supplierShortName: '河南盛世机械',
          supplierMainCategory: '传感器',
          supplierCode: 'GYS6667787990',
          contactArea: '广东省-广州市-黄埔区',
          contactAddress: '文冲街上塘北路35号',
          depositBank: '中国工商银行',
          receivablesAccount: '6212263602053303588',
          receivablesPerson: '李小姐',
          legalRepresentative: '杨先生',
          uscCode: '914401017435912',
          enterpriseQueryResult: '2023-06-08【有效请求】查询成功',
          inquiryChannel: '天眼查',
        },
        {
          curTabValue: '2',
          createTime: '2025-1-10 12:00:00',
          supplierStatus: '2',
          frozenStatus: '',
          recoverStatus: '2',
          outStatus: '',
          blackListStatus: '',
          supplierLevel: 'C',
          supplierFullName: '广州三五零配件有限公司',
          supplierShortName: '广州三五零配件',
          supplierMainCategory: '传感器',
          supplierCode: 'GYS6667787990',
          contactArea: '广东省-广州市-黄埔区',
          contactAddress: '文冲街上塘北路35号',
          depositBank: '中国工商银行',
          receivablesAccount: '6212263602053303588',
          receivablesPerson: '李小姐',
          legalRepresentative: '杨先生',
          uscCode: '914401017435912',
          enterpriseQueryResult: '2023-06-08【有效请求】查询成功',
          inquiryChannel: '天眼查',
        },
        {
          curTabValue: '2',
          createTime: '2025-1-10 12:00:00',
          supplierStatus: '2',
          frozenStatus: '',
          recoverStatus: '',
          outStatus: '2',
          blackListStatus: '',
          supplierLevel: 'C',
          supplierFullName: '广汽集团广天有限公司',
          supplierShortName: '广汽集团广天',
          supplierMainCategory: '传感器',
          supplierCode: 'GYS6667787990',
          contactArea: '广东省-广州市-黄埔区',
          contactAddress: '文冲街上塘北路35号',
          depositBank: '中国工商银行',
          receivablesAccount: '6212263602053303588',
          receivablesPerson: '李小姐',
          legalRepresentative: '杨先生',
          uscCode: '914401017435912',
          enterpriseQueryResult: '2023-06-08【有效请求】查询成功',
          inquiryChannel: '天眼查',
        },
        // 淘汰供应商
        {
          curTabValue: '3',
          createTime: '2025-1-10 12:00:00',
          supplierStatus: '2',
          frozenStatus: '',
          recoverStatus: '',
          outStatus: '',
          blackListStatus: '1',
          supplierLevel: 'D',
          supplierFullName: '河南盛世机械工具集团有限公司',
          supplierShortName: '河南盛世机械',
          supplierMainCategory: '传感器',
          supplierCode: 'GYS6667787990',
          contactArea: '广东省-广州市-黄埔区',
          contactAddress: '文冲街上塘北路35号',
          depositBank: '中国工商银行',
          receivablesAccount: '6212263602053303588',
          receivablesPerson: '李小姐',
          legalRepresentative: '杨先生',
          uscCode: '914401017435912',
          enterpriseQueryResult: '2023-06-08【有效请求】查询成功',
          inquiryChannel: '天眼查',
        },
        {
          curTabValue: '3',
          createTime: '2025-1-10 12:00:00',
          supplierStatus: '2',
          frozenStatus: '',
          recoverStatus: '',
          outStatus: '',
          blackListStatus: '2',
          supplierLevel: 'D',
          supplierFullName: '广州三五零配件有限公司',
          supplierShortName: '广州三五零配件',
          supplierMainCategory: '传感器',
          supplierCode: 'GYS6667787990',
          contactArea: '广东省-广州市-黄埔区',
          contactAddress: '文冲街上塘北路35号',
          depositBank: '中国工商银行',
          receivablesAccount: '6212263602053303588',
          receivablesPerson: '李小姐',
          legalRepresentative: '杨先生',
          uscCode: '914401017435912',
          enterpriseQueryResult: '2023-06-08【有效请求】查询成功',
          inquiryChannel: '天眼查',
        },
        // 黑名单
        {
          curTabValue: '4',
          createTime: '2025-1-10 12:00:00',
          supplierStatus: '2',
          frozenStatus: '',
          recoverStatus: '',
          outStatus: '',
          blackListStatus: '',
          supplierLevel: 'D',
          supplierFullName: '河南盛世机械工具集团有限公司',
          supplierShortName: '河南盛世机械',
          supplierMainCategory: '传感器',
          supplierCode: 'GYS6667787990',
          contactArea: '广东省-广州市-黄埔区',
          contactAddress: '文冲街上塘北路35号',
          depositBank: '中国工商银行',
          receivablesAccount: '6212263602053303588',
          receivablesPerson: '李小姐',
          legalRepresentative: '杨先生',
          uscCode: '914401017435912',
          enterpriseQueryResult: '2023-06-08【有效请求】查询成功',
          inquiryChannel: '天眼查',
        },
        {
          curTabValue: '4',
          createTime: '2025-1-10 12:00:00',
          supplierStatus: '2',
          frozenStatus: '',
          recoverStatus: '',
          outStatus: '',
          blackListStatus: '',
          supplierLevel: 'D',
          supplierFullName: '广州三五零配件有限公司',
          supplierShortName: '广州三五零配件',
          supplierMainCategory: '传感器',
          supplierCode: 'GYS6667787990',
          contactArea: '广东省-广州市-黄埔区',
          contactAddress: '文冲街上塘北路35号',
          depositBank: '中国工商银行',
          receivablesAccount: '6212263602053303588',
          receivablesPerson: '李小姐',
          legalRepresentative: '杨先生',
          uscCode: '914401017435912',
          enterpriseQueryResult: '2023-06-08【有效请求】查询成功',
          inquiryChannel: '天眼查',
        },
      ]
    }
  },
  created() {
    this.handleSearch();
  },
  methods: {
    // 获取 搜索框参数
    getSearchValue(currentValue, selectFiledList) {
      console.log(currentValue, selectFiledList, 'getSearchValue');
      this.handleSearch();
    },
    // 确定搜索 高级搜索
    onAdSearch() {
      console.log(this.adSearchFormData, '确定搜索 高级搜索');
      this.handleSearch();
    },
    // 重置 高级搜索
    onAdClear() {
      console.log('重置 高级搜索');
    },
    onTagClick(data) {
      console.log(data, 'onTagClick');
      const { name } = data;
      if (['筛选组合01', '筛选组合02', '筛选组合03'].includes(name)) {
        this.adSearchFormData.supplierStatus = '1';
        this.adSearchFormData.frozenStatus = '1';
        this.adSearchFormData.recoverStatus = '1';
        this.adSearchFormData.outStatus = '1';
        this.adSearchFormData.blackListStatus = '1';
      } else if (['筛选组合04', '筛选组合05', '筛选组合06'].includes(name)) {
        this.adSearchFormData.supplierStatus = '2';
        this.adSearchFormData.frozenStatus = '2';
        this.adSearchFormData.recoverStatus = '2';
        this.adSearchFormData.outStatus = '2';
        this.adSearchFormData.blackListStatus = '2';
      } else {
        this.adSearchFormData.supplierStatus = '3';
        this.adSearchFormData.frozenStatus = '3';
        this.adSearchFormData.recoverStatus = '3';
        this.adSearchFormData.outStatus = '3';
        this.adSearchFormData.blackListStatus = '3';
      }
    },
    handleSearch() {
      this.loading = true;
      setTimeout(() => {
        this.loading = false;
        this.onSelectClear();
        this.dataSource = this.originalDataSource.filter(item => item.curTabValue === this.curTabValue);
      }, 500)
    },
    // 导出
    onExport() {

    },
    // 删除
    onBatchDelete() {
      if (this.selectedRowKeys.length) {
        this.$confirm({
          title: '批量删除',
          content: '确认批量删除？',
          okText: '确认',
          cancelText: '取消',
          onOk: () => {
            this.handleSearch();
            this.$message.success(`操作成功`);
          }
        });
      } else {
        this.$message.error(`请选择数据！`);
      }
    },
    tabChange() {
      this.handleSearch();
    },
    // 范围日期处理
    setTimeRange(startTimeName, endTimeName, timeRange, timeStringRange) {
      if (timeStringRange.length > 0) {
        const [one, two] = timeStringRange;
        this.adSearchFormData[startTimeName] = one + ' ' + '00:00:00';
        this.adSearchFormData[endTimeName] = two + ' ' + '23:59:59';
      } else {
        this.adSearchFormData[startTimeName] = '';
        this.adSearchFormData[endTimeName] = '';
      }
    },
    onApply(title, record) {
      this.$confirm({
        title,
        content: `确认${title}？`,
        okText: '确认',
        cancelText: '取消',
        onOk: () => {
          this.handleSearch();
          this.$message.success(`操作成功`);
        }
      });
    },
    onCheck() {
      this.$refs.EffectDetail.open();
    }
  }
}
</script>

<style lang="less" scoped>
.circle-hover {
  cursor: pointer;
}
.circle-hover:hover {
  color: #1890FF;
}
</style>
